<template>
	<view>
		<view class="tip" v-if="type == 2">复购奖励仅供参考，若您当月未复购12包，将无法获得当月复购奖励</view>
		<view class="list">
			<block v-for="(item, index) in list" :key="index" v-if="list.length > 0">
				<view class="item acea-row row-between-wrapper">
					<image class="avatar" :src="item.inviteUserLogo || item.userLogo"></image>
					<view class="info">
						<view class="name">{{ item.inviteUserName || item.userName }}</view>
						<view class="msg" v-if="type == 1">
							成为了
							<text class="bold">{{ item.markName }}</text>
						</view>
						<view class="msg" v-if="type == 2">{{ item.buyProduct + '×' + (item.num ? item.num : '') }}
						</view>
					</view>
					<view class="detailed">
						<view class="money">
							奖励
							<text class="bold">¥{{ item.reward }}</text>
						</view>
						<view class="date">{{ item.createTime.substring(0, 10) }}</view>
					</view>
				</view>
			</block>
			<view v-if="list.length == 0">
				<emptyPage title="暂无奖励记录~"></emptyPage>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getInviteRewardList,
		getRepeatBuyList
	} from '@/api/user.js';
	import emptyPage from '@/components/emptyPage.vue';

	export default {
		components: {
			emptyPage
		},
		data() {
			return {
				type: 1,
				page: 1,
				limit: 10,
				list: []
			};
		},
		onLoad(options) {
			this.type = options.type;
		},
		onShow: function() {
			if (!this.type) {
				uni.showToast({
					title: '参数错误',
					icon: 'none',
					duration: 1000,
					mask: true,
					success: function(res) {
						setTimeout(function() {
							uni.navigateBack({
								delta: 1
							});
						}, 1200);
					}
				});
			}
			if (this.type == 1) {
				uni.setNavigationBarTitle({
					title: '邀请奖励明细'
				});
			} else if (this.type == 2) {
				uni.setNavigationBarTitle({
					title: '复购奖励明细'
				});
			}
			this.getList();
		},
		methods: {
			getList: function() {
				let that = this;
				let list = that.list;
				let listNew = [];
				console.log(this.type);
				if (this.type == 1) {
					console.log(this.type);
					getInviteRewardList({
						page: that.page,
						limit: that.limit
					}).then(res => {
						// listNew = list.concat(res.data);
						that.page = that.page + 1;
						that.$set(that, 'list', res.data);
					});
				}
				if (this.type == 2) {
					getRepeatBuyList({
						page: that.page,
						limit: that.limit
					}).then(res => {
						// listNew = list.concat(res.data);
						that.page = that.page + 1;
						that.$set(that, 'list', res.data);
					});
				}
			}
		},
		onReachBottom: function() {
			this.getList();
		}
	};
</script>

<style scoped lang="scss">
	.tip {
		padding: 10rpx 20rpx;
		font-size: 26rpx;
		color: #f93434;
		background-color: #fbdcdc;
	}

	.list {
		padding: 0 20rpx;
		color: #333;
	}

	.list .item {
		padding: 20rpx 0;
		border-bottom: solid 1rpx #ccc;

		.avatar {
			width: 80rpx;
			height: 80rpx;
			border-radius: 50%;
		}

		.info {
			flex: 1;
			margin: 0 10rpx;

			.name {
				font-size: 32rpx;
			}
		}

		.detailed {
			text-align: right;
		}

		.bold {
			font-weight: bold;
		}
	}
</style>
